<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
      <link rel="stylesheet" href="../css/reset.css">
      <link rel="stylesheet" href="../css/index.css">
    <title>Title</title>
</head>
    <body>
        <div class="warp">
            <header>
                <div class="header_t">
                    <span>语言:</span>
                    <a href="javascript:;">English</a> |
                    <a href="javascript:;">简体中文</a> |
                    <a href="javascript:;">繁体中文</a>
                </div>
                <div class="header_c">
                    <div class="left">
                        <img src="../img/img.png" alt="">
                    </div>
                    <div class="right">
                        <h3>免费在线 BMI 计算器</h3>
                        <p>身体质量指数 (Body Mass Index, 简称BMI), 亦称克托莱指数, 是目前国际上常用的衡量人体胖瘦程度以及是否健康的一个标准。BMI 值超标，意味着你必须减肥了。</p>
                    </div>
                </div>
            </header>
        </div>
        <main>
            <div class="main_l">
                <h4>免费计算你的身体质量指数 (BMI)</h4>
                <div id="box">
                    <img src="../img/img_1.png" alt="">
                    <span> 你的 BMI 值: <i id="BMI">40.1</i>，身体状态：<i id="classify">肥胖</i></span>
                </div>
                <div>
                    <span>度量单位:</span>
                    <span>
                        <input checked type="radio" name="sys"> 公制
                        <input type="radio" name="sys"> 英制
                    </span>
                </div>
                <div>
                    <span>我的身高:</span>
                    <input id="height" type="text">
                    <span>单位: 厘米 cm</span>
                </div>
                <div>
                    <span>我的体重:</span>
                    <input id="weight" type="text">
                    <span>单位: 千克 kg</span>
                </div>
                <div>
                    <span>BMI 标准:</span>
                    <select>
                        <option>中国标准</option>
                        <option>国际标准</option>
                        <option>日本标准</option>
                    </select>
                </div>
                <div>
                    <input type="checkbox">
                    <span>自动保存 BMI 历史记录</span>
                </div>
                <button>计算BMI</button>
            </div>
            <div class="main_r">
                <img id="img" src="../img/img_1.png" alt="">
                <h2>BMI 中国标准</h2>
                <dl>
                    <dt>
                        <span>分类</span>
                        <span>BMI 范围</span>
                    </dt>
                    <dd>
                        <span>偏瘦</span>
                        <span><= 18.4</span>
                    </dd>
                    <dd>
                        <span>正常</span>
                        <span>18.5 ~ 23.9</span>
                    </dd>
                    <dd>
                        <span>过重</span>
                        <span>24.0 ~ 27.9</span>
                    </dd>
                    <dd>
                        <span>肥胖</span>
                        <span>>= 28.0</span>
                    </dd>
                </dl>
            </div>
        </main>
        <table>
            <thead>
                <tr>
                    <th>#</th>
                    <th>日期</th>
                    <th>身高</th>
                    <th>体重</th>
                    <th>BMI</th>
                    <th>操作</th>
                </tr>
            </thead>
            <tbody>
            <tr><td colspan="6">暂无数据</td></tr>
            <!--<tr>
                <td>1</td>
                <td>2021-08-30</td>
                <td>178</td>
                <td>80</td>
                <td>23.7</td>
                <td>
                    <a href="javascript:void(0)">删除</a>
                </td>
            </tr>-->
            </tbody>
        </table>



        <!--<div class="toast">
            <div class="remind">
                请输入合法数据
            </div>
        </div>-->

        <div class="loading">
            <span>
                <svg t="1631669867213" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3974" width="70" height="70"><path d="M256 529.066667H85.333333a17.066667 17.066667 0 1 1 0-34.133334h170.666667a17.066667 17.066667 0 0 1 0 34.133334z" opacity=".278" p-id="3975" fill="#FF7F50"></path><path d="M99.84 640a17.066667 17.066667 0 0 1-4.437333-33.553067l164.693333-44.373333a17.066667 17.066667 0 1 1 8.891733 32.9728l-164.693333 44.373333a17.544533 17.544533 0 0 1-4.4544 0.580267z" opacity=".322" p-id="3976" fill="#FF7F50"></path><path d="M264.533333 462.523733a16.896 16.896 0 0 1-4.369066-0.580266l-164.693334-43.52a17.0496 17.0496 0 1 1 8.721067-32.989867l164.693333 43.52a17.066667 17.066667 0 1 1-4.352 33.570133z" opacity=".239" p-id="3977" fill="#FF7F50"></path><path d="M384.017067 307.2a17.032533 17.032533 0 0 1-14.7968-8.533333l-85.333334-147.626667a17.066667 17.066667 0 0 1 29.559467-17.083733l85.333333 147.626666A17.066667 17.066667 0 0 1 384.017067 307.2z" opacity=".122" p-id="3978" fill="#FF7F50"></path><path d="M639.982933 307.2a17.0496 17.0496 0 0 1-14.762666-25.6l85.333333-147.626667a17.066667 17.066667 0 1 1 29.559467 17.066667l-85.333334 147.626667a17.032533 17.032533 0 0 1-14.7968 8.533333z" opacity=".922" p-id="3979" fill="#FF7F50"></path><path d="M692.906667 347.306667a17.066667 17.066667 0 0 1-12.117334-29.098667l120.337067-121.173333a17.066667 17.066667 0 1 1 24.234667 24.046933l-120.337067 121.173333a17.1008 17.1008 0 0 1-12.117333 5.051734z" opacity=".878" p-id="3980" fill="#FF7F50"></path><path d="M733.883733 401.066667a17.066667 17.066667 0 0 1-8.5504-31.8464l147.626667-85.333334a17.0496 17.0496 0 1 1 17.066667 29.5424l-147.626667 85.333334a16.776533 16.776533 0 0 1-8.516267 2.304z" opacity=".839" p-id="3981" fill="#FF7F50"></path><path d="M512 273.066667a17.066667 17.066667 0 0 1-17.066667-17.066667V85.333333a17.066667 17.066667 0 0 1 34.133334 0v170.666667a17.066667 17.066667 0 0 1-17.066667 17.066667z" p-id="3982" fill="#FF7F50"></path><path d="M578.577067 281.6a17.066667 17.066667 0 0 1-16.520534-21.418667l43.52-164.693333a17.066667 17.066667 0 0 1 33.006934 8.721067l-43.52 164.693333a17.066667 17.066667 0 0 1-16.4864 12.6976z" opacity=".961" p-id="3983" fill="#FF7F50"></path><path d="M445.44 282.453333a17.066667 17.066667 0 0 1-16.469333-12.629333l-44.373334-164.693333a17.066667 17.066667 0 0 1 32.955734-8.891734l44.373333 164.693334a17.066667 17.066667 0 0 1-16.4864 21.521066z" opacity=".078" p-id="3984" fill="#FF7F50"></path><path d="M924.177067 640c-1.4848 0-2.9696-0.187733-4.4544-0.580267l-164.693334-44.373333a17.066667 17.066667 0 0 1 8.874667-32.9728l164.693333 44.373333a17.066667 17.066667 0 0 1-4.420266 33.553067z" opacity=".722" p-id="3985" fill="#FF7F50"></path><path d="M881.476267 742.4a17.015467 17.015467 0 0 1-8.482134-2.269867l-148.48-85.333333a17.0496 17.0496 0 1 1 16.9984-29.5936l148.48 85.333333a17.0496 17.0496 0 0 1-8.516266 31.863467z" opacity=".678" p-id="3986" fill="#FF7F50"></path><path d="M813.226667 830.293333a17.015467 17.015467 0 0 1-12.066134-5.000533l-120.337066-120.337067a17.0496 17.0496 0 1 1 24.132266-24.132266l120.337067 120.337066a17.0496 17.0496 0 0 1-12.066133 29.1328z" opacity=".639" p-id="3987" fill="#FF7F50"></path><path d="M938.666667 529.066667H768a17.066667 17.066667 0 1 1 0-34.133334h170.666667a17.066667 17.066667 0 1 1 0 34.133334z" opacity=".761" p-id="3988" fill="#FF7F50"></path><path d="M401.066667 941.226667a17.066667 17.066667 0 0 1-16.4864-21.504l44.373333-164.693334a17.066667 17.066667 0 1 1 32.955733 8.874667l-44.373333 164.693333a17.066667 17.066667 0 0 1-16.469333 12.629334z" opacity=".478" p-id="3989" fill="#FF7F50"></path><path d="M298.6496 898.56a17.066667 17.066667 0 0 1-14.779733-25.565867l85.333333-148.48a17.083733 17.083733 0 0 1 29.5936 16.9984l-85.333333 148.48a17.032533 17.032533 0 0 1-14.813867 8.567467z" opacity=".439" p-id="3990" fill="#FF7F50"></path><path d="M512 955.733333a17.066667 17.066667 0 0 1-17.066667-17.066666V768a17.066667 17.066667 0 1 1 34.133334 0v170.666667a17.066667 17.066667 0 0 1-17.066667 17.066666z" opacity=".522" p-id="3991" fill="#FF7F50"></path><path d="M725.3504 898.56a17.032533 17.032533 0 0 1-14.7968-8.533333l-85.333333-147.626667a17.066667 17.066667 0 0 1 29.559466-17.066667l85.333334 147.626667a17.066667 17.066667 0 0 1-14.762667 25.6z" opacity=".6" p-id="3992" fill="#FF7F50"></path><path d="M622.062933 942.08c-7.509333 0-14.421333-5.0176-16.469333-12.629333l-44.3904-164.693334a17.066667 17.066667 0 1 1 32.9728-8.874666l44.3904 164.693333a17.066667 17.066667 0 0 1-16.503467 21.504z" opacity=".561" p-id="3993" fill="#FF7F50"></path><path d="M759.4496 463.36a17.083733 17.083733 0 0 1-4.420267-33.553067l164.693334-44.373333a17.066667 17.066667 0 0 1 8.874666 32.955733l-164.693333 44.373334a16.657067 16.657067 0 0 1-4.4544 0.597333z" opacity=".702" p-id="3994" fill="#FF7F50"></path><path d="M330.24 347.306667a17.015467 17.015467 0 0 1-12.066133-5.000534l-120.32-120.32a17.0496 17.0496 0 1 1 24.132266-24.132266l120.32 120.32a17.0496 17.0496 0 0 1-12.066133 29.1328z" opacity=".161" p-id="3995" fill="#FF7F50"></path><path d="M290.116267 401.066667a17.032533 17.032533 0 0 1-8.533334-2.286934l-147.626666-85.333333a17.066667 17.066667 0 1 1 17.083733-29.5424l147.626667 85.333333a17.066667 17.066667 0 0 1-8.5504 31.829334z" opacity=".2" p-id="3996" fill="#FF7F50"></path><path d="M142.523733 742.4a17.066667 17.066667 0 0 1-8.567466-31.8464l147.626666-85.333333a17.066667 17.066667 0 1 1 17.083734 29.559466l-147.626667 85.333334a16.930133 16.930133 0 0 1-8.516267 2.286933z" opacity=".361" p-id="3997" fill="#FF7F50"></path><path d="M209.92 830.293333a17.066667 17.066667 0 0 1-12.117333-29.098666l120.32-121.173334a17.066667 17.066667 0 0 1 24.2176 24.029867l-120.32 121.1904a16.896 16.896 0 0 1-12.100267 5.051733z" opacity=".4" p-id="3998" fill="#FF7F50"></path></svg>
            </span>
        </div>

        <script src="../js/jquery.js"></script>
        <script src="../js/index.js"></script>
    </body>
</html>
